﻿<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!--自适应device-width设备宽度-->



<meta name="viewport"
	content="width=device-width, initial-scale=1,maximum-scale=1" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script src="echarts.js"></script>
<script src="china.js"></script>
<script src="jquery.min.js"></script>
<title>ECharts</title>

<style>
</style>
</head>

<body>

	<div id="main"
		style="height: 800px; width: 100%; border: 1px solid black;"></div>


	<script>
	var myChart = echarts.init(document.getElementById('main'));
	var initialData = function() {
		$.ajax({
		type:"GET",
		url:"/rest/getLineTowerByVoltage/500?t="+new Date().getTime(),
		dataType: 'json',
		success: function(data){
			console.log(data);
		     myChart.setOption(getMapOption(data));
		},
		error : function() {  
		     alert("异常！");  
		     myChart.setOption(getMapOption);
		 }  
		});
	};
	initialData();
/*  var pointdata = [];
 
pointdata.push({
          coords: [[113.67558,22.74884], [113.82067,22.75357]]
		});
 pointdata.push({
          coords: [[113.82067,22.75357],[113.9146,22.61871]]
		}); */      
var getLineTower = function(tdata){
	var pointdata = [];
	for (var i = 0; i &lt; tdata.length; i++){
	 pointdata.push({
         coords: tdata[i]
		});
	}
	return pointdata;
}
    
var color = ['#a6c84c', '#ffa022', '#46bee9'];

var getMapOption =  function(lineData){
	var series = [];
	if(lineData){
		for (var i = 0; i &lt; lineData.length; i++) { 
			var dataItem = lineData[i]; 
			 series.push(
					    {
					        name: dataItem[0],
					        type: 'lines',
					        zlevel: 2,
					        lineStyle: {
					            normal: {
					                color: color[1],
					                width: 1,
					            }
					        },
					        data: getLineTower(dataItem[1])
					    });
			
		 } 
	}
	
   
	var option = {
	    backgroundColor: '#404a59',
	   
	    geo: {
	        map: 'china',
	        label: {
	            emphasis: {
	                show: false
	            }
	        },
	        roam: true,
	        itemStyle: {
	            normal: {
	                areaColor: '#323c48',
	                borderColor: '#404a59'
	            },
	            emphasis: {
	                areaColor: '#2a333d'
	            }
	        }
	    },
	    series: series
	};
	return option;
}
;

 //myChart.setOption({
  //              series: [{
   //                     type: 'map',
   //                     map: 'china'
   //             }]
   //     });



</script>

</body>
</html>